<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>details</title>
  <!-- 引入bootstrap框架文件 -->
  <link rel="stylesheet" href="./assets/css/bootstrap.min.css">
  <!-- 引入animate.css文件 -->
  <link rel="stylesheet" href="./assets/css/animate.min.css">
  <!-- 引入初始化文件 -->
  <link rel="stylesheet" href="./assets/css/reset.css">
  <!-- 引入公共样式 -->
  <link rel="stylesheet/less" href="./assets/css/common.less">
  <!-- 引入index本页样式 -->
  <link rel="stylesheet/less" href="./assets/css/details.less">

</head>

<body>
  <!-- header -->
  <header class="header">
    <a class="back" href="index.html" target="_self">
      Back
    </a>
    <div class="found">
      产品详情
    </div>
    <div class="ms">
      <img src="./assets/images/details-xin.png" alt="">
    </div>
  </header>

  <!-- banner -->
  <div class="banner">
    <img src="./assets/images/details-banner.png" alt="">
  </div>

  <!-- information -->
  <div class="information">
    <div class="price">
      <div class="left">￥<span>32</span>
      </div>
      <div class="right">购买</div>
    </div>
    <div class="evaluation">
      <div class="left">
        <div class="icon">
          <img src="./assets/images/details-xin.png" alt="">
        </div>
        <div class="mork">
          好评度
          <span>99%</span>
        </div>
      </div>
      <div class="right">
        共605个评价&gt;
      </div>
    </div>
  </div>

  <!-- store -->
  <div class="store">
    <div class="title">
      <div class="left">适用商店</div>
      <div class="right glyphicon glyphicon-menu-right"></div>
    </div>
    <div class="list">
      <div class="item">
        <div class="print">
          <img src="./assets/images/details-bg1.png" alt="">
        </div>
        <div class="message">
          <div class="left">
            <div class="name">万岁寿司（正佳店）</div>
            <div class="package">
              <div class="rank">
                <img src="./assets/images/details-xin.png" alt="">
                <img src="./assets/images/details-xin.png" alt="">
                <img src="./assets/images/details-xin.png" alt="">
                <img src="./assets/images/details-xin.png" alt="">
                <img src="./assets/images/details-xin.png" alt="">
              </div>
              <div class="score">10分</div>

            </div>
            <div class="distance">离你100m</span></div>
            <div class="mork">查看详情&gt;&gt;</span></div>
          </div>
          <div class="right">
            进入
          </div>
        </div>
      </div>
      <div class="item">
        <div class="print">
          <img src="./assets/images/details-bg2.png" alt="">
        </div>
        <div class="message">
          <div class="left">
            <div class="name">万岁寿司（体育西店）</div>
            <div class="package">
              <div class="rank">
                <img src="./assets/images/details-xin.png" alt="">
                <img src="./assets/images/details-xin.png" alt="">
                <img src="./assets/images/details-xin.png" alt="">
                <img src="./assets/images/details-xin.png" alt="">
                <img src="./assets/images/details-xin.png" alt="">
              </div>
              <div class="score">10分</div>

            </div>
            <div class="distance">离你100m</span></div>
            <div class="mork">查看详情&gt;&gt;</span></div>
          </div>
          <div class="right">
            进入
          </div>
        </div>
      </div>
      <div class="item">
        <div class="print">
          <img src="./assets/images/details-bg3.png" alt="">
        </div>
        <div class="message">
          <div class="left">
            <div class="name">万岁寿司（昌岗店）</div>
            <div class="package">
              <div class="rank">
                <img src="./assets/images/details-xin.png" alt="">
                <img src="./assets/images/details-xin.png" alt="">
                <img src="./assets/images/details-xin.png" alt="">
                <img src="./assets/images/details-xin.png" alt="">
                <img src="./assets/images/details-xin.png" alt="">
              </div>
              <div class="score">10分</div>

            </div>
            <div class="distance">离你100m</span></div>
            <div class="mork">查看详情&gt;&gt;</span></div>
          </div>
          <div class="right">
            进入
          </div>
        </div>
      </div>
      <div class="item">
        <div class="print">
          <img src="./assets/images/details-bg1.png" alt="">
        </div>
        <div class="message">
          <div class="left">
            <div class="name">万岁寿司（正佳店）</div>
            <div class="package">
              <div class="rank">
                <img src="./assets/images/details-xin.png" alt="">
                <img src="./assets/images/details-xin.png" alt="">
                <img src="./assets/images/details-xin.png" alt="">
                <img src="./assets/images/details-xin.png" alt="">
                <img src="./assets/images/details-xin.png" alt="">
              </div>
              <div class="score">10分</div>

            </div>
            <div class="distance">离你100m</span></div>
            <div class="mork">查看详情&gt;&gt;</span></div>
          </div>
          <div class="right">
            进入
          </div>
        </div>
      </div>
      <div class="item">
        <div class="print">
          <img src="./assets/images/details-bg2.png" alt="">
        </div>
        <div class="message">
          <div class="left">
            <div class="name">万岁寿司（体育西店）</div>
            <div class="package">
              <div class="rank">
                <img src="./assets/images/details-xin.png" alt="">
                <img src="./assets/images/details-xin.png" alt="">
                <img src="./assets/images/details-xin.png" alt="">
                <img src="./assets/images/details-xin.png" alt="">
                <img src="./assets/images/details-xin.png" alt="">
              </div>
              <div class="score">10分</div>

            </div>
            <div class="distance">离你100m</span></div>
            <div class="mork">查看详情&gt;&gt;</span></div>
          </div>
          <div class="right">
            进入
          </div>
        </div>
      </div>
      <div class="item">
        <div class="print">
          <img src="./assets/images/details-bg3.png" alt="">
        </div>
        <div class="message">
          <div class="left">
            <div class="name">万岁寿司（昌岗店）</div>
            <div class="package">
              <div class="rank">
                <img src="./assets/images/details-xin.png" alt="">
                <img src="./assets/images/details-xin.png" alt="">
                <img src="./assets/images/details-xin.png" alt="">
                <img src="./assets/images/details-xin.png" alt="">
                <img src="./assets/images/details-xin.png" alt="">
              </div>
              <div class="score">10分</div>
            </div>
            <div class="distance">离你100m</span></div>
            <div class="mork">查看详情&gt;&gt;</span></div>
          </div>
          <div class="right">
            进入
          </div>
        </div>
      </div>
    </div>
  </div>

  <!-- foot -->
  <div class="foot">
    <a class="item" href="index.html" target="_self">
      <div class="icon">
        <img src="./assets/images/homed.png" alt="">
      </div>
      <div class="name">首页</div>
    </a>
    <a class="item" href="classification.html" target="_self">
      <div class="icon">
        <img src="./assets/images/classification.png" alt="">
      </div>
      <div class="name">分类</div>
    </a>

    <a class="item" href="found.html" target="_self">
      <div class="icon">
        <img src="./assets/images/found.png" alt="">
      </div>
      <div class="name">发现</div>
    </a>
    <a class="item" href="mine.html" target="_self">
      <div class="icon">
        <img src="./assets/images/mine.png" alt="">
      </div>
      <div class="name">我的</div>
    </a>
  </div>
</body>

</html>
<!-- 引入less.js 文件 -->
<script src="./assets/js/less.min.js"></script>
<!-- 引入jquery文件 -->
<script src="./assets/js/jquery.js"></script>
<!-- 引入bootstrap.js文件 -->
<script src="./assets/js/bootstrap.min.js"></script>
<!-- 引入wow.js文件 -->
<script src="assets/js/wow.min.js"></script>
<!-- 实例化wow -->
<script>
  new WOW().init();
</script>